{# Pieces shared by Overseer pages. #}
{% from "components/macros/layout.html" import card, chart_panel, facts, health_badge %}
{% from "components/macros/form.html" import action, range_form %}

{# A page's live charts (``overseer_live.chart_panel``): the range chips,
   which re-request ``target`` at ``url`` over the new window (its stream
   follows), then the charts, two across. #}
{% macro live_charts(panel, target, url) %}
{% if panel.charts %}
{{ range_form(panel.windows, panel.window, url, target, field="window", aria="Chart window", class="mt-4 flex justify-end") }}
<div class="grid gap-4 lg:grid-cols-2 mt-3">
  {% for chart in panel.charts %}
  {{ chart_panel(chart.id, chart.title, "line", chart.data, subtitle=chart.subtitle, live=True, empty=chart.empty) }}
  {% endfor %}
</div>
{% endif %}
{% endmacro %}

{# An HTTP verb, set in the mono label voice. #}
{# A name over a muted line of what it is (a key family's purpose), the
   line's title its whole or ``title``. #}
{% macro named(name, about, title=none, mono=false) %}<span class="block text-sm font-semibold text-aegis-text truncate{{ ' font-mono' if mono }}">{{ name }}</span>{% if about %}<span class="block text-xxs text-aegis-muted truncate" title="{{ title or about }}">{{ about }}</span>{% endif %}{% endmacro %}

{% macro method_tag(method) %}
<span data-method class="inline-block font-mono text-xxs font-semibold px-1.5 py-0.5 rounded border border-aegis-border {{ 'text-aegis-teal' if method == 'GET' else 'text-error' if method == 'DELETE' else 'text-aegis-amber' }}">{{ method }}</span>
{% endmacro %}

{# The "Current status" card every component page shows. ``extra`` rows
   go between the health check and the registered name. #}
{% macro status_card(component, name, extra=[]) %}
{% call card("Current status") %}
  {{ facts([("State", health_badge(component.status.value)), ("Health check", "%.1f ms"|format(component.response_time_ms) if component.response_time_ms is not none else none)] + extra + [("Registered as", name)]) }}
{% endcall %}
{% endmacro %}

{# A column's cell renderer for data_table: a row's HTTP method(s). #}
{% macro method_cell(value) %}{% for method in (value if value is not string else [value]) %}{{ method_tag(method) }}{% endfor %}{% endmacro %}

{# A link into Overseer > Code, as every page draws one. #}
{% macro code_link(url, label) %}<a href="{{ url }}" class="font-mono text-aegis-teal hover:underline">{{ label }}</a>{% endmacro %}

{# A line of the project's source, linked to it in Overseer > Code:
   ``app/core/storage.py:36`` (``overseer_code.line_url``). #}
{% macro line_link(path, line) %}{{ code_link(line_url(path, line), path ~ ":" ~ line) }}{% endmacro %}
{# What to fix of a part (``overseer_conformance.todos``): each finding's
   action, and every place it points at, linked to its line with what is
   there. The map's hover and the Patterns page read the same list. #}
{% macro todos(items) %}{% for todo in items or [] %}<div data-todo class="mt-1"><p data-tone="{{ todo.tone }}" class="toned">{{ todo.action }}</p>
  <ul class="mt-0.5 space-y-0.5">{% for place in todo.places %}<li class="break-words">{{ line_link(place.path, place.line) }} <span class="text-aegis-muted">{{ place.note }}</span></li>{% endfor %}</ul></div>{% endfor %}{% endmacro %}

{# A module of the app's own, linked to its file in Overseer > Code
   (``overseer_code.module_url``); a library's stays text. #}
{% macro module_link(module) %}{% set url = module_url(module) %}{% if url %}{{ code_link(url, module) }}{% else %}{{ module }}{% endif %}{% endmacro %}

{# Reading many rows the way Logs does (Logs, a table's Rows, a query):
   ``wraps``, the page's Alpine scope (``extra`` state riding along), whose
   ``wrap`` opens every row; Wrap, which flips it, and with rows, the jumps
   to either end of ``body``. #}
{% macro wraps(extra="") %}x-data="{ {{ extra }}wrap: false }" x-bind:class="wrap && 'logs-wrap'"{% endmacro %}
{% macro wrap_actions(body, rows=True) %}
{{ action("Wrap", "data-wrap x-on:click=\"wrap = !wrap\" x-bind:aria-pressed=\"wrap\"") }}
{% if rows %}
{{ action("Top", 'data-scroll-to="#' ~ body ~ ' > tr:first-child"') }}
{{ action("Bottom", 'data-scroll-to="#' ~ body ~ ' > tr:nth-last-child(1 of .log-row)"') }}
{% endif %}
{%- endmacro %}

{# ... and the rows themselves: flat on the canvas, not on a card, running
   to the bottom of the window (or of what holds them: ``height``) and
   scrolling inside it, so what is above stays put; a click on a row (not a link, not a selection) opens it. #}
{% macro rows_scroller(classes="overflow-auto", height="h-[calc(100vh-16rem)] min-h-[24rem]") %}
<div data-scroll class="{{ classes }} {{ height }} border-t border-aegis-border">{{ caller() }}</div>
{%- endmacro %}
{% macro opens_rows() %}x-on:click="$event.target.closest('a, button') || getSelection().toString() || $event.target.closest('tr.log-row')?.toggleAttribute('data-open')"{% endmacro %}

{# A traceback's frame in the app's own code (``overseer_code.own_frames``). #}
{% macro own_frame(frame) %}{{ line_link(frame.path, frame.line) }}{% endmacro %}